<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="../../../../common/common.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<link href="${ctx}/static/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
    <link href="${ctx}/static/css/basic.css" rel="stylesheet" type="text/css">
    <link href="${ctx}/static/plugins/validationEngine/css/validationEngine.jquery.css" rel="stylesheet" type="text/css">
    <style type="text/css">
        .btn-sm {
            border-width: 4px;
            font-size: 13px;
            padding: 4px 9px;
            line-height: 1.39;
        }

        .code_space {
            margin-left: -4px;
            margin-right: 14px;
        }

        .btn_key {
            background-color: #6fb3e0 !important;
            border-color: #6fb3e0;
        }

        .btn_key:hover {
            color: #fff;
            background-color: #39b3d7;
            border-color: #269abc;
        }

        .code_width {
            width: 36.5%;
        }

        @media only screen and (max-width: 767px ) {
            .code_width {
                width: 102%;
            }
        }

        .radios {
            margin-bottom: 20px;
            float: left;
            margin-left: 40px;
        }
        .form-control{
        	width:250px;
        }
        .image-control{
            width: 200px;
            height: 100px;
            border: solid thin seashell;
        }
    </style>
</head>
<body>
<div class="content">
    <form class="form-horizontal" id="addForm">
	    <br>
		<br>
		<br>
		          <div class="form-group">
		            <label for="roleCode" class="col-sm-4 control-label">订单号:</label>
		            <div class="col-sm-3">
		                <input type="text" class="form-control validate[required]" id="orderNo" name="orderNo" placeholder="自动生成" readonly="readonly" value="${orderNO}">
		            </div>
		        </div>
		        <div class="form-group">
		            <label for="roleCode" class="col-sm-4 control-label"><span style="color:red;">*</span>订单金额:</label>
		            <div class="col-sm-3">
		                <input type="text" class="form-control validate[required,custom[number],min[0.01]]" id="orderMoney" name="orderMoney" placeholder="请输入订单金额">
		            </div>
		        </div>
		          <div class="form-group">
		            <label for="description" class="col-sm-4 control-label"><span style="color:red;">*</span>会员卡号:</label>
		            <div class="col-sm-3">
		                <input type="text" class="form-control validate[required,custom[number]]" id="memberCard" name="memberCard"  placeholder="请输入会员卡号">
		            </div>
		        </div>
		         <div class="form-group">
		            <label for="personName" class="col-sm-4 control-label"><span style="color:red;">*</span>支付方式:</label>
		            <div class="col-sm-3">
		                <input type="radio"  name="payTpe" value="1" checked/>现金支付 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		                <input type="radio"  name="payTpe" value="2" />积分支付
		            </div>
		        </div>
		         <div class="form-group" hidden="hidden" id="yanzhengma">
	            <label for="fixedLineTelephone" class="col-sm-4 control-label"  ><span style="color:red;">*</span>验证码:</label>
		            <div class="col-sm-3">
		                <input type="text" class="form-control validate[required,custom[number]]" id="verificationCode" name="verificationCode"
		                       placeholder="输入验证码" style="width: 120px;display:inline;">
		                &nbsp;&nbsp;&nbsp;&nbsp;
		                <input type="button" onclick="getValidCode()" class="btn btn-primary proving" value="发短信至会员手机" >
		            </div>
	        	</div>
		        <div class="form-group" id="zhifumima">
		            <label for="description" class="col-sm-4 control-label"><span style="color:red;">*</span>支付密码:</label>
		            <div class="col-sm-3">
		                <input type="password" class="form-control validate[required,custom[number]]" id="payPassWord" name="payPassWord"  placeholder="请输入商户支付密码">
		            </div>
		        </div>
		        
		         <!-- <div class="form-group" id="zhifumima">
		            <label for="description" class="col-sm-4 control-label">账户余额:</label>
		            <div class="col-sm-3">
		                <input type="text" class="form-control" id="accountBalance" name="accountBalance" data-fun="dataFunDemo" readonly="readonly">
		           </div> -->
		        </div>
        <div class="form-group">
            <div class="col-sm-10">
            	<button type="button" id="addBtn" class="btn btn-primary">创建订单</button>
            </div>
        </div>
    </form>
</div>
<script src="${ctx}/static/plugins/jQuery/jQuery-2.1.4.min.js"></script>
<script src="${ctx}/static/bootstrap/js/bootstrap.min.js"></script>
<script src="${ctx}/static/plugins/layer/layer.js"></script>
<script src="${ctx}/static/plugins/validationEngine/jquery.validationEngine-zh_CN.js"></script>
<script src="${ctx}/static/plugins/validationEngine/jquery.validationEngine.js"></script>
<script src="${ctx}/static/js/common/common.js" type="text/javascript"></script>
<script src="${ctx}/static/js/common/base.js" type="text/javascript"></script>
<script src="${ctx}/static/js/common/page.js" type="text/javascript"></script>
<script src="${ctx}/static/js/common/area.js" type="text/javascript"></script>
<script type="text/javascript">		 
		//businessProfitRatio
	$(function () {
		
		$("#addForm").validationEngine({ 
			promptPosition: "topRight", 
			validationEventTriggers:"keyup blur", 
			success :  false,
			failure : function() { callFailFunction()  }
			});
		
		$("#addBtn").click(function(){
			 var memberCard = $("#memberCard").val();
			  if(memberCard == null || memberCard == "" || isNaN(memberCard)){
				  alert("请输入会员卡号");
				  return;
			  }
			  
			 
			  
			var flag = $("#addForm").validationEngine("validate");
		     if(!flag){
		          return false;
		           }
		     var orderMoney = $("#orderMoney").val();
		     if(orderMoney.indexOf(".") > 0 &&   orderMoney.substring(orderMoney.indexOf(".")+1,orderMoney.length).length>2){
		    	 alert("金额最多2位小数点！");
				  return;
		 	}
		     
			            //提交数据
			  $.ajax({
//			        async       : false,
			        type 		: "POST",
			        url: "${ctx}/api/merchantUnLineOrder/addUnLineOrder",
             data 		: $("#addForm").serializeJson(),
             success 	: function( d ) {
                 console.log(d);
                 if(d.code=="200"){
     				$("#orderNo").val("");
     				$("#orderMoney").val("");
     				$("#memberCard").val("");
     				$("#payPassWord").val("");
     				$("#verificationCode").val("");
     				alert("创建订单成功");

    				window.parent.menuSpecifyClick(74);//这里的26为数据库菜单待审核供应商的id
<%--      				window.location.href = "${ctx}/api/merchantUnLineOrder/unLineOrderPage" --%>
                 } else {
                     alert(d.message);
                 }
             }
            });
        });
    });
		
	  //发送短信验证码
	function getValidCode(){
		  var memberCard = $("#memberCard").val();
		  if(memberCard == null || memberCard == "" || isNaN(memberCard)){
			  alert("请输入会员卡号");
			  return;
		  }
		  
		/* 发送短信倒计时 */
        var time = 60;
        var s = time+1;
        var timer = null;
        function countDown(){
			s--;
			$('.proving').val('('+s+')正在发送');
			$('.proving').attr("disabled",true); 
			$('.proving').css('background','#ccc');
			if(s==0){
				clearInterval(timer);
				$('.proving').val('重新发送');
				$('.proving').attr("disabled",false);
				$('.proving').css('background','#6ACF33');
				s=time+1;
			}
        }
		countDown();
		timer = setInterval(countDown,1000);
        sendValidCode();
	}
	  
    $(function(){
    	$("input[name='payTpe']").change(function() {
    		 if ($(this).val() == 1) {
 	        	$("#zhifumima").show();
 	        	$("#yanzhengma").hide();
 	        } else {
 	        	$("#zhifumima").hide();
 	        	$("#yanzhengma").show();
 	        }
    	});
    	}); 
    function sendValidCode() {
        $.ajax({
            async: false,
            url: "/api/merchantUnLineOrder/sendValidCode",
            data: {
            	"memberCard" :  $("#memberCard").val(),
            },
            type: "POST",
            dataType: "json",
            success: function (data) {
                if (data.code == "200") {
                } else {
                    alert(data.message);
                }
            }
        });
    }

</script>
</body>
</html>